<!DOCTYPE html>
<html>
    <head> 
       <meta charset="utf-8" />
       <title>Login</title>	   
	<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
	<script>
		$(document).ready(function() 
		{
			$("form").on("submit", function(e)
			{	
				e.preventDefault();
				$.ajax({
					type: "POST",
					data: JSON.stringify(
					{
						submit: $(this).find("[name=submit]").val(),
						username: $(this).find("[name=username]").val(),
						password: $(this).find("[name=password]").val(),
					}),
			success: function(jqXHR, textStatus)
			{
			    window.location.href = 'control.html';
			},
			error: function(jqXHR, textStatus, errorThrown)
			{
			    alert("Login failed: " + textStatus);
			}
				}).done(function(e)
				{
					
				});
			});
		});
			
			</script>
	  
    </head>
    <body>	
		<form method='POST'>
		<table>
			<th>Log in</th>
			<tr><td>Username:</td><td><input type="text" name="username" id="username"></td></tr>
			<tr><td>Password:</td><td><input type="password" name="password" id="password"></td></tr>
			<tr><td>&nbsp;</td><td><input type="submit" name="submit" value="login" id="submit"></td></tr>
		</table>
		</form>
    </body>
</html>
